﻿var editMode = 0;

function fixTextboxMaxLength(e, maxLength) {
    if (this.value.length > 1000) {
        return false;
    }
    else {
        return true;
    }
}

function onMouseoverParagraphBox() {
    if (editMode == 0) {
        if (!$(this).children('div').children('.edit-paragraph').is(':visible')) {
            $(this).addClass('display-paragraph-focus');
            $(this).children('div').children('.edit-paragraph-butt').show();
        }
        else {
            if ($(this).hasClass('display-paragraph-focus')) {
                $(this).removeClass('display-paragraph-focus');
            }
        }
    }
}

function onMouseoutParagraphBox() {
    if (editMode == 0) {
        if (!$(this).children('div').children('.edit-paragraph').is(':visible')) {
            $(this).removeClass('display-paragraph-focus');
            $(this).children('div').children('.edit-paragraph-butt').hide();
        }
    }
}

function onMouseoverEditButt() {
    $(this).css({
        "background-color": "#9B9B99"
    });
}
function onMouseoutEditButt() {
    $(this).css({
        "background-color": "#D9D9D7"
    });
}

function cancelDeletionMode() {
    editMode = 0;
    var delConfirm = $(this).parent().parent();
    var background = delConfirm.parent().children('.del-background');
    delConfirm.hide();
    background.hide();
}

function cancelEditMode() {
    editMode = 0;
    var editParagraph = $(this).parent().parent();
    var displayParagraph = editParagraph.parent().children('.display-paragraph');
    editParagraph.hide();
    displayParagraph.show();
    paragraphBox.addClass('display-paragraph-focus');
}

function deleteImgClick() {
    editMode = 1;
    var updatePanel = $(this).parent().parent();
    var paragraphBox = updatePanel.parent();
    var delConfirm = updatePanel.children('.del-confirm');
    var paragraphBoxBorderHeight = parseInt(paragraphBox.css('border-top-width'), 10) + parseInt(paragraphBox.css('border-bottom-width'), 10);
    updatePanel.children('.del-background').height(paragraphBox.outerHeight() - paragraphBoxBorderHeight);
    centerBoxInsideParent(delConfirm, paragraphBox);
    delConfirm.show();
    updatePanel.children('.del-background').show();
}

function editImgClick() {
    editMode = 1;
    var paragraphBox = $(this).parent().parent();
    paragraphBox.children('.edit-paragraph').show();
    paragraphBox.children('.display-paragraph').hide();
    $(this).parent().hide();
}

function onUpdatingParagraph(panelToBeRefreshedId) {
    var loading = $(panelToBeRefreshedId).children('.loading');
    var editParagraph = $(panelToBeRefreshedId).children('.edit-paragraph');
    centerBoxInsideParent(loading, editParagraph);
    loading.children('div').children('span').text('Updating paragraph...');
    loading.show();
    editParagraph.children('div').children().children("input[type='text']").attr('disabled', 'disabled');
    editParagraph.children('div').children('textarea').attr('disabled', 'disabled');
    editParagraph.children('div').children('div').children('div').children("input[type='submit']").attr('disabled', 'disabled');
}

function onUpdatedParagraph(panelToBeRefreshedId) {
    editMode = 0;
    var editParagraph = $(panelToBeRefreshedId).children('.edit-paragraph');
    $(panelToBeRefreshedId).children('.loading').hide();
    editParagraph.children('div').children('textarea').bind('keypress', fixTextboxMaxLength);
    editParagraph.children('div').children('textarea').removeAttr('disabled');
    editParagraph.children('div').children('div').children().children("input[type='text']").removeAttr('disabled');
    editParagraph.children('div').children('div').children('div').children("input[type='submit']").removeAttr('disabled');

    editParagraph.fadeOut(300);
    $(panelToBeRefreshedId).children('.display-paragraph').fadeOut(300);
    $(panelToBeRefreshedId).children('.display-paragraph').fadeIn("slow");

    $(panelToBeRefreshedId).parent().removeClass('display-paragraph-focus');
    $(panelToBeRefreshedId).parent().bind('mouseover', onMouseoverParagraphBox);
    $(panelToBeRefreshedId).parent().bind('mouseout', onMouseoutParagraphBox);

    $(panelToBeRefreshedId).children('.edit-paragraph-butt').children('div').bind('mouseover', onMouseoverEditButt);
    $(panelToBeRefreshedId).children('.edit-paragraph-butt').children('div').bind('mouseout', onMouseoutEditButt);

    $(panelToBeRefreshedId).children('.del-confirm').children('.edit-del-butt').children('.edit-del-cancel').bind('click', cancelDeletionMode);
    $(panelToBeRefreshedId).children('.edit-paragraph').children('.edit-del-butt').children('.edit-del-cancel').bind('click', cancelEditMode);
    $(panelToBeRefreshedId).children('.edit-paragraph-butt').children('div.edit-icon').bind('click', editImgClick);
    $(panelToBeRefreshedId).children('.edit-paragraph-butt').children('div.del-icon').bind('click', deleteImgClick);
}

function onDeletingParagraph(panelToBeRefreshedId) {
    editMode = 0;
    var background = $(panelToBeRefreshedId).children('.del-background');
    var loading = $(panelToBeRefreshedId).children('.loading');
    centerBoxInsideParent(loading, background);
    loading.children('div').children('span').text('Deleting paragraph...');
    $(panelToBeRefreshedId).children('.del-confirm').hide();
    loading.show();
}

function onDeletedParagraph(panelToBeRefreshedId) {
    editMode = 0;
    $(panelToBeRefreshedId).children('.del-background').hide();
    $(panelToBeRefreshedId).children('.loading').hide();
    $(panelToBeRefreshedId).parent().slideToggle('slow');
}

$(function () {
    $(document).ready(function () {
        $('.paragraph-box').bind('mouseover', onMouseoverParagraphBox);
        $('.paragraph-box').bind('mouseout', onMouseoutParagraphBox);
        $('.add-paragraph').children('div').children('textarea').bind('keypress', fixTextboxMaxLength);
        $('.edit-paragraph').children('textarea').bind('keypress', fixTextboxMaxLength);
        $('.edit-paragraph-butt').children('div').bind('mouseover', onMouseoverEditButt);
        $('.edit-paragraph-butt').children('div').bind('mouseout', onMouseoutEditButt);
        $('.edit-paragraph').children('.edit-del-butt').children('.edit-del-cancel').bind('click', cancelEditMode);
        $('.del-confirm').children('.edit-del-butt').children('.edit-del-cancel').bind('click', cancelDeletionMode);
        $('.edit-paragraph-butt').children('div.edit-icon').bind('click', editImgClick);
        $('.edit-paragraph-butt').children('div.del-icon').bind('click', deleteImgClick);
    });
});